<!--<html lang="zh" xmlns:th="http://www.thymeleaf.org">-->
<!--<head>-->
<!--    <meta charset="utf-8">-->
<!--    <link href="/css/bootstrap.min.css" rel="stylesheet">-->
<!--    <link href="/css/materialdesignicons.min.css" rel="stylesheet">-->
<!--    <link href="/css/animate.min.css" rel="stylesheet">-->
<!--    <link href="/css/validate.css" rel="stylesheet">-->
<!--    <link href="/css/style.min.css" rel="stylesheet">-->
<!--    <link href="/css/sat.css" rel="stylesheet">-->

<!--    <link href="/js/bootstrap-table/bootstrap-table.min.css" rel="stylesheet">-->
<!--    <link href="/js/bootstrap-datepicker/bootstrap-datepicker3.min.css" rel="stylesheet">-->
<!--    <link href="/js/bootstrap-datetimepicker/bootstrap-datetimepicker.min.css" rel="stylesheet">-->
<!--    <link href="/js/bootstrap-clockpicker/bootstrap-clockpicker.min.css" rel="stylesheet">-->
<!--    <script>-->
<!--        if (document.referrer === ''){-->
<!--            location='/index';-->
<!--        }-->
<!--    </script>-->
<!--</head>-->
<!--<body>-->
<!--<div class="container-fluid p-t-15">-->

<!--    <div class="row">-->
<!--        <div class="col-md-6 col-xl-3">-->
<!--            <div class="card bg-primary text-white sat-radius">-->
<!--                <div class="card-body clearfix">-->
<!--                    <div class="flex-box">-->
<!--                        <span class="img-avatar img-avatar-48 bg-translucent"><i class="mdi mdi-currency-cny fs-22"></i></span>-->
<!--                        <span class="fs-22 lh-22"><div th:text="${incomecount}"/></span>-->
<!--                    </div>-->
<!--                    <div class="text-right">本月销售额</div>-->
<!--                </div>-->
<!--            </div>-->
<!--        </div>-->
<!--        <div class="col-md-6 col-xl-3">-->
<!--            <div class="card bg-purple text-white sat-radius">-->
<!--                <div class="card-body clearfix">-->
<!--                    <div class="flex-box">-->
<!--                        <span class="img-avatar img-avatar-48 bg-translucent"><i class="mdi mdi-content-paste fs-22"></i></span>-->
<!--                        <span class="fs-22 lh-22"><div th:text="${ordercount}"/></span>-->
<!--                    </div>-->
<!--                    <div class="text-right">本月完成订单数</div>-->
<!--                </div>-->
<!--            </div>-->
<!--        </div>-->

<!--        <div class="col-md-6 col-xl-3">-->
<!--            <div class="card bg-danger text-white sat-radius">-->
<!--                <div class="card-body clearfix">-->
<!--                    <div class="flex-box">-->
<!--                        <span class="img-avatar img-avatar-48 bg-translucent"><i class="mdi mdi-account-group fs-22"></i></span>-->
<!--                        <span class="fs-22 lh-22"><div th:text="${custcount}"/></span>-->
<!--                    </div>-->
<!--                    <div class="text-right">客户总数</div>-->
<!--                </div>-->
<!--            </div>-->
<!--        </div>-->

<!--        <div class="col-md-6 col-xl-3">-->
<!--            <div class="card bg-success text-white sat-radius">-->
<!--                <div class="card-body clearfix">-->
<!--                    <div class="flex-box">-->
<!--                        <span class="img-avatar img-avatar-48 bg-translucent"><i class="mdi mdi-account fs-22"></i></span>-->
<!--                        <span class="fs-22 lh-22"><div th:text="${empcount}"/></span>-->
<!--                    </div>-->
<!--                    <div class="text-right">员工总数</div>-->
<!--                </div>-->
<!--            </div>-->
<!--        </div>-->

<!--        <div class="col-lg-6">-->
<!--            <div class="card sat-radius">-->
<!--                <header class="card-header"><div class="card-title">汽车销量排行榜</div></header>-->
<!--                <div class="card-body">-->
<!--                    <canvas id="chart-carsale" width="400" height="200"></canvas>-->
<!--                </div>-->
<!--            </div>-->
<!--        </div>-->

<!--        <div class="col-lg-6">-->
<!--            <div class="card sat-radius">-->
<!--                <header class="card-header"><div class="card-title">客户地区分布图</div></header>-->
<!--                <div class="card-body">-->
<!--                    <canvas id="chart-cust" width="280" height="280"></canvas>-->
<!--                </div>-->
<!--            </div>-->
<!--        </div>-->


<!--    </div>-->
<!--</div>-->
<!--<script type="text/javascript" src="/js/jquery.min.js"></script>-->
<!--<script type="text/javascript" src="/js/popper.min.js"></script>-->
<!--<script type="text/javascript" src="/js/bootstrap.min.js"></script>-->

<!--&lt;!&ndash;图表插件&ndash;&gt;-->
<!--<script type="text/javascript" src="/js/Chart.min.js"></script>-->


<!--<script>-->
<!--    new Chart($("#chart-carsale"), {-->
<!--        type: 'horizontalBar',-->
<!--        data: {-->
<!--            labels: [(${carname})],-->
<!--            datasets: [{-->
<!--                label: "销量",-->
<!--                backgroundColor: "rgba(51,202,185,0.5)",-->
<!--                borderColor: "rgba(0,0,0,0)",-->
<!--                hoverBackgroundColor: "rgba(51,202,185,0.7)",-->
<!--                hoverBorderColor: "rgba(0,0,0,0)",-->
<!--                data: [[${sale}]]-->
<!--            }]-->
<!--        },-->
<!--        options: {-->
<!--            scales: {-->
<!--                xAxes: [{-->
<!--                    ticks: {-->
<!--                        beginAtZero: true-->
<!--                    }-->
<!--                }]-->
<!--            }-->
<!--        }-->
<!--    });-->


<!--    new Chart($("#chart-cust"), {-->
<!--        type: 'pie',-->
<!--        data: {-->
<!--            labels: [(${address})],-->
<!--            datasets: [{-->
<!--                data: [[${addressnum}]],-->
<!--                backgroundColor: ['rgba(255,99,132,1)', 'rgba(54, 162, 235, 1)', 'rgba(255, 206, 86, 1)','rgba(125,123,132,1)', 'rgba(54, 52, 265, 1)', 'rgba(266, 152, 366, 3)']-->
<!--            }]-->
<!--        },-->
<!--        options: {-->
<!--            responsive: false-->
<!--        }-->
<!--    });-->




<!--</script>-->


<!--</body>-->
<!--</html>-->
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8">
    <link href="/css/bootstrap.min.css" rel="stylesheet">
    <link href="/css/materialdesignicons.min.css" rel="stylesheet">
    <link href="/css/animate.min.css" rel="stylesheet">
    <link href="/css/validate.css" rel="stylesheet">
    <link href="/css/style.min.css" rel="stylesheet">
    <link href="/css/sat.css" rel="stylesheet">

    <link href="/js/bootstrap-table/bootstrap-table.min.css" rel="stylesheet">
    <link href="/js/bootstrap-datepicker/bootstrap-datepicker3.min.css" rel="stylesheet">
    <link href="/js/bootstrap-datetimepicker/bootstrap-datetimepicker.min.css" rel="stylesheet">
    <link href="/js/bootstrap-clockpicker/bootstrap-clockpicker.min.css" rel="stylesheet">
    <script>
        if (document.referrer === ''){
            location='/index';
        }
    </script>
</head>
<body>
<div class="container-fluid p-t-15">

    <div class="row">
        <div class="col-md-6 col-xl-3">
            <div class="card bg-primary text-white sat-radius sat-shadow">
                <div class="card-body clearfix">
                    <div class="flex-box">
                        <span class="img-avatar img-avatar-48 bg-translucent"><i class="mdi mdi-currency-cny fs-22"></i></span>
                        <span class="fs-22 lh-22"><div th:text="${incomecount}"/></span>
                    </div>
                    <div class="text-right">本月销售额</div>
                </div>
            </div>
        </div>
        <div class="col-md-6 col-xl-3">
            <div class="card bg-purple text-white sat-radius sat-shadow">
                <div class="card-body clearfix">
                    <div class="flex-box">
                        <span class="img-avatar img-avatar-48 bg-translucent"><i class="mdi mdi-content-paste fs-22"></i></span>
                        <span class="fs-22 lh-22"><div th:text="${ordercount}"/></span>
                    </div>
                    <div class="text-right">本月完成订单数</div>
                </div>
            </div>
        </div>

        <div class="col-md-6 col-xl-3">
            <div class="card bg-danger text-white sat-radius sat-shadow">
                <div class="card-body clearfix">
                    <div class="flex-box">
                        <span class="img-avatar img-avatar-48 bg-translucent"><i class="mdi mdi-account-group fs-22"></i></span>
                        <span class="fs-22 lh-22"><div th:text="${custcount}"/></span>
                    </div>
                    <div class="text-right">客户总数</div>
                </div>
            </div>
        </div>

        <div class="col-md-6 col-xl-3">
            <div class="card bg-success text-white sat-radius sat-shadow">
                <div class="card-body clearfix">
                    <div class="flex-box">
                        <span class="img-avatar img-avatar-48 bg-translucent"><i class="mdi mdi-account fs-22"></i></span>
                        <span class="fs-22 lh-22"><div th:text="${empcount}"/></span>
                    </div>
                    <div class="text-right">员工总数</div>
                </div>
            </div>
        </div>

        <div class="col-lg-6">
            <div class="card sat-radius sat-shadow sat-control-wh">
                <header class="card-header"><div class="card-title">汽车销量排行榜</div></header>
                <div class="card-body">
                    <canvas id="chart-carsale" width="400" height="200"></canvas>
                </div>
            </div>
        </div>

        <div class="col-lg-6">
            <div class="card sat-radius sat-shadow sat-control-wh">
                <header class="card-header"><div class="card-title">客户地区分布图</div></header>
                <div class="card-body">
                    <canvas id="chart-assets" width="400" height="300"></canvas>
                </div>
            </div>
        </div>
    </div>
</div>
<script type="text/javascript" src="/js/jquery.min.js"></script>
<script type="text/javascript" src="/js/popper.min.js"></script>
<script type="text/javascript" src="/js/bootstrap.min.js"></script>

<!--图表插件-->
<script type="text/javascript" src="/js/Chart.min.js"></script>


<script>
    new Chart($("#chart-carsale"), {
        type: 'horizontalBar',
        data: {
            labels: [(${carname})],
    datasets: [{
        label: "销量",
        backgroundColor: "rgba(51,202,185,0.5)",
        borderColor: "rgba(0,0,0,0)",
        hoverBackgroundColor: "rgba(51,202,185,0.7)",
        hoverBorderColor: "rgba(0,0,0,0)",
        data: [[${sale}]]
    }]
    },
    options: {
        scales: {
            xAxes: [{
                ticks: {
                    beginAtZero: true
                }
            }]
        }
    }
    });

    new Chart($("#chart-assets"), {
        type: 'pie',
        data: {
            labels: [(${address})],
            datasets: [{
                data: [[${addressnum}]],
                backgroundColor: ['rgba(153, 102, 255, 0.7)', 'rgba(255, 159, 64, 0.7)', 'rgba(255, 99, 132, 0.7)', 'rgba(54, 162, 235, 0.7)', 'rgba(75, 192, 192, 0.7)'],
                borderColor: 'rgba(0,0,0,0)',
                borderWidth: 0
            }]
        },
        options: {
            responsive: true,
            maintainAspectRatio: false,
            legend: {
                position: 'right',
                labels: {
                    usePointStyle: true,
                    padding: 20
                }
            },
            tooltips: {
                callbacks: {
                    label: function(tooltipItem, data) {
                        return data.labels[tooltipItem.index] + ': ' + data.datasets[tooltipItem.datasetIndex].data[tooltipItem.index] + '%';
                    }
                }
            }
        }
    });
</script>
</body>
</html>